<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>分组练习</title>
</head>
<body>
<ul>
    <li>亲戚
        <lu>
            <li>习大大</li>
            <li>速度</li>
            <li>的撒大</li>
        </lu>
    </li>
    <li>同事
        <lu>
            <li>更加开放</li>
            <li>即可</li>
            <li>给</li>
        </lu>
    </li>
    <li>女友们
        <lu>
            <li>张慧敏</li>
            <li>刘岩</li>
            <li>王祖贤</li>
        </lu>
    </li>
</ul>
<script src="../js/jquery-1.4.2.js"></script>
<script>
    // //选中第二层的ul并让其隐藏
    // $("li>ul").hide();
    //
    // $("body>ul>li").click(function(){
    //     //事件方法中的this代表事件源(触发事件的元素) this是js对象
    //     //把点击的li(js对象)转成jq对象并获取里面的子元素ul并让其显示
    //     $(this).children().toggle();
    //     $(this).siblings().children().hide();
    //
    // })
    $("li>ul").hide();
    $("body>ul>li").click(function(){
        $(this).children().toggle();
        $(this).siblings().children().hide();

    })


</script>


</body>
</html>